<template>
  <div style="height: 523px; overflow: hidden; background: white; border:1px solid white ; border-radius: 8px; margin-top: 10px;">
    <div style="background-color: #E9EEF3; height: 120px; margin: 10px; padding: 4px; border-radius: 7px;">
      <el-row style="margin-top: 14px;">
        <el-col :span="10" style="font-size: 14px;">
          产品一级分类&nbsp;
          <el-select v-model="form">
            <el-option value="dasd">请选择</el-option>
          </el-select>
        </el-col>
        <el-col :span="10" style="font-size: 14px;">
          产品二级分类&nbsp;
          <el-select v-model="sa">
            <el-option value="dasd">请选择</el-option>
          </el-select>
        </el-col>
      </el-row>
      <el-row style="margin-top: 14px;">
        <el-col :span="10" style="font-size: 14px;">
          产品三级分类&nbsp;
          <el-select v-model="sa">
            <el-option value="dasd">请选择</el-option>
          </el-select>
        </el-col>
        <el-col :span="10" style="font-size: 14px; margin-left: 15px;">
          选择产品
          <el-select v-model="sa">
            <el-option value="dasd">请选择</el-option>
          </el-select>
        </el-col>

        <el-col :span="12">
          <div style="text-align: left; margin-top: 12px;margin-left: 55px">
             <span class="demonstration">建档时间</span>
             <el-date-picker
                style="height: 25px; margin-left: 20px;"
               v-model="value2"
               type="monthrange"
               align="right"
               unlink-panels
               range-separator="至"
               start-placeholder="开始月份"
               end-placeholder="结束月份"
               :picker-options="pickerOptions">
             </el-date-picker>
           </div>
        </el-col>
        <el-col :span="1">
          <el-button type="primary" size="mini" round="" style=" margin-top: 12px;" >按条件查询</el-button>
        </el-col>
      </el-row>







    </div>
    <div style="background-color: #E9EEF3; height: 328px; margin: 10px; padding: 4px; border-radius: 7px;">
      <template>
        <el-table :data="tableData" style="width: 100% " size="mini">
         <el-table-column prop="pSige_idkc" label="配置单编号" width="420">
       </el-table-column>
       <el-table-column prop="cpbh" label="产品编号" width="100">
       </el-table-column>
       <el-table-column prop="cpmc" label="产品名称" width="100">
       </el-table-column>
       <el-table-column prop="reviewSign" label="复核状态" width="100">
          </el-table-column>
          <el-table-column label="操作" width="100">
             <template slot-scope="scope">
                <el-button size="mini" @click.native.prevent="ddd(scope.row.cpbh)" round>变更</el-button>
           </template>
          </el-table-column>
        </el-table>
      </template>

      <div class="block" style="margin-top: 2px;">
        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="14"
          :page-sizes="[100, 200, 300, 400]" :page-size="100" layout="total, sizes, prev, pager, next, jumper"
          :total="400">
        </el-pagination>
      </div>


    </div>







    <el-dialog title="收货地址" :visible.sync="dialogFormVisible">
      <el-form :model="form">
        <el-form-item label="库房编号" :label-width="formLabelWidth">
          <el-input v-model="form.name" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="库房编号" :label-width="formLabelWidth">
          <el-input v-model="form.name" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="责任人编号" :label-width="formLabelWidth">
          <el-input v-model="form.name" autocomplete="off"></el-input>
        </el-form-item>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
      </div>
    </el-dialog>

<el-dialog
  title="安全庫存配置單"
  :visible.sync="dialogVisible"
  width="62%"
  height="300px"
  :before-close="handleClose">
<div id="father">
    <el-container>
      <div id="son">
        <el-row>
          <el-col :span="7">
              &nbsp;&nbsp;&nbsp;&nbsp;产品名称:{{cpmc}}
          </el-col>
          <el-col :span="15">
            产品编号:{{cpbh}}
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="9">
           库存报警下限数: <input type="text" v-model="down" id="inp" style=" margin-top: 15px;" />
          </el-col>
          <el-col :span="15" >
            库存报警上限数: <input type="text" v-model="up" id="inp" style=" margin-top: 15px;" />
          </el-col>
        </el-row>
        <el-row>

          <el-col :span="9" >
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            &nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            设计人:<input type="text" v-model="denjiPerson" id="inp" style=" margin-top: 15px;" />
          </el-col>
        </el-row>
      </div>
    </el-container>
    <el-table ref="multipleTable" :data="tableDataa" border tooltip-effect="dark" style="width: 100%;margin-top: 15px;"
      @selection-change="handleSelectionChange" size="mini">
    <el-table-column prop="pSige_idkc" label="序号" width="100">
   </el-table-column>
      <el-table-column prop="houseName" label="库存名称" width="130">
        
      </el-table-column>
      <el-table-column prop="proidClass" label="存储地址编号" width="120">
      </el-table-column>
      <el-table-column prop="pronameClass" label="存储地址名称" width="150">
      </el-table-column>
      <el-table-column prop="ccmiaoshu" label="存储单元简称" width="130">	
					<input type="text" v-model="ccmiaoshu" id="inp1" />
      </el-table-column>
      <el-table-column prop="maxupkc" label="最大存储量" width="128">		
						<input type="text" v-model="maxupkc" id="inp1" />
      </el-table-column>
      <el-table-column prop="cuncudanwei" label="存储单位" width="140">
					<input type="text" v-model="cuncudanwei" id="inp1" />
      </el-table-column>
    </el-table>
    <div id="sons">
      <el-row>
        <el-col :span="9">
          登记人:<input type="text" v-model="djr" id="inp" style=" margin-top: 10px;" />
        </el-col>
        <el-col :span="15" :offset="3">
          登记时间 <input type="text" v-model="time" id="inp" style=" margin-top: 10px;" />
        </el-col>
      </el-row>
      <el-row style="margin-top: 20px;">
        <el-col :span="2" style="margin-left: 72px;">
          配置要求:
        </el-col>
        <el-col :span="16">
          <textarea v-model="yaoqiu" style="width: 100%; height: 170px;">
          </textarea>
        </el-col>
      </el-row>
    </div>
  </div>
  <span slot="footer" >
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="qd">确 定</el-button>
  </span>
</el-dialog>

  </div>
</template>

<script>
  export default {
    name: 'repchange',
    data() {
      return {
        tableData: [{
				pSige_idkc:'',
				cpbh:'',
				cpmc:'',
				reviewSign:''
				}],
					tableDataa: [{
					pSige_idkc:'',
					houseName:'',
					proidClass:'',
				  pronameClass:'',
					ccmiaoshu:'',
					maxupkc:'',
					cuncudanwei:'',
				}],
				ccmiaoshu:'',
				maxupkc:'',
				cuncudanwei:'',
				cpmc:'',
					cpbh:'',
				down:'',
				up:'',
				denjiPerson:'',
				time:'',
				yaoqiu:'',
				sh:'未审核',
        gridData: [],
				dialogVisible:false,
        dialogTableVisible: false,
        dialogFormVisible: false,
        form: {
          name: '',
          region: '',
          date1: '',
          date2: '',
          delivery: false,
          type: [],
          resource: '',
          desc: ''
        },
        formLabelWidth: '120px',
        pickerOptions: {
          shortcuts: [{
            text: '本月',
            onClick(picker) {
              picker.$emit('pick', [new Date(), new Date()]);
            }
          }, {
            text: '今年至今',
            onClick(picker) {
              const end = new Date();
              const start = new Date(new Date().getFullYear(), 0);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近六个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setMonth(start.getMonth() - 6);
              picker.$emit('pick', [start, end]);
            }
          }]
        },
        value1: '',
        value2: ''
      }
    },
			mounted(){
			this.$http.post("selRepadminyfh")
			.then((res) => {														
							 this.tableData=res.data;		
														 
					})
					.catch((err) => { //请求失败
				console.log(err);
			}); 
		},
    methods: {
			ddd:function(row){
					this.dialogVisible=true;
				var demo=new URLSearchParams()
				demo.append("cpbh",row);
				this.$http.post("selidRepadminyfh",demo)
				.then((rew)=>{
					  this.tableDataa=rew.data;
						this.cpmc=rew.data[0].cpmc;
						this.cpbh=rew.data[0].cpbh;
						this.down=rew.data[0].downkc;
						this.up=rew.data[0].upkc;
						this.denjiPerson=rew.data[0].denjiPersonkc;
						this.time=rew.data[0].timekc;
						this.yaoqiu=rew.data[0].yaoqiukc;
						this.ccmiaoshu=rew.data[0].ccmiaoshu;
						this.cuncudanwei=rew.data[0].cuncudanwei;
					  this.maxupkc=rew.data[0].maxupkc;
						
						
				})
					.catch((err) => { //请求失败
					console.log(err);
				}); 
			   
			},
			qd(){
				var demo=new URLSearchParams()
				demo.append("proSige_id",this.tableDataa[0].pSige_idkc);
				demo.append("reviewSign",this.sh);
				demo.append("down",this.down);
				demo.append("up",this.up);
				demo.append("maxup",this.maxupkc);
				demo.append("denjiPerson",this.denjiPerson);
				demo.append("time",this.time);
				demo.append("yaoqiu",this.yaoqiu);
				demo.append("uint",this.ccmiaoshu);
				demo.append("cuint",this.cuncudanwei);
				demo.append("aderessid",this.proidClass);
				demo.append("aderess",this.pronameClass);
				
				this.$http.post("updpSidRepadminkcdy",demo)
					.then((res)=> {
						    
								this.dialogFormVisible = false;
						})
						.catch((err) => { //请求失败
					console.log(err);
				}); 
				}, 
      tableRowClassName({
        row,
        rowIndex
      }) {
        if (rowIndex === 1) {
          return 'warning-row';
        } else if (rowIndex === 3) {
          return 'success-row';
        }
        return '';
      },
      handleSizeChange(val) {
        console.log(`每页 ${val} 条`);
      },
      handleCurrentChange(val) {
        console.log(`当前页: ${val}`);
      },
			
    }
  }
</script>

<style scoped="scoped">
  * {
    padding: 0px;
    margin: 0px;
  }

  .el-breadcrumb__inner {
    color: black;

  }

  .el-input__inner {

    height: 25px;

  }
   .el-date-editor .el-range-separator {
        height: 33px;


   }
   .el-input__icon {
       height: 33px;

   }
  .el-input__prefix,
  .el-input__suffix {
    position: absolute;
    top: 7px;
    -webkit-transition: all .3s;
    height: 100%;
    color: #C0C4CC;
    text-align: center;
  }


  .el-table td {
    padding: 9px 0;
  }
	
	
		
	#inp {
	    border-top: none;
	    border-left: none;
	    border-right: none;
	  }
	#inp1{
		 border-top: none;
		border-left: none;
		border-right: none;
		border-bottom: none;
	}
	 #father {
	  height: 480px;
	  overflow: hidden;
	  background: white;
	  border: 1px solid white;
	  border-radius: 12px;
	
	}
	
	#sons {
	  /* margin: 9px auto; */
	
	  width: 100%;
	  padding: 0px;
	  background-color: white;
	  margin-top: 15px;
	  /* border: 3px solid whitesmoke; */
	  /* border-radius: 16px; */
	
	}
	
	#son {
	
	padding: 15px;
	  width: 100%;
	  background-color: white;
	
	}
	th {
	  border-top-color: #000000;
	}
</style>
